<template>
    <div class="register">
        <div class="logo">
            <img src="https://msmk2019.oss-cn-shanghai.aliyuncs.com/uploads/image/2019pILfAg7Avr1567732916.png" alt="">
        </div>
        <div class="form">
            <van-field
                v-model="phone"
                center
                type="tel"
                placeholder="请输入手机号"
                >
                <template #button>
                    <span style="color:rgb(252,85,0)" @click="sendCode">获取验证码</span>
                </template>
            </van-field>
            <van-field v-model="password"  placeholder="请输入短信验证码" />
            <div class="findPassword">*为注册过的手机将自动注册</div>
            <div class="register-a" @click="toLogin">使用密码登录</div>
            <button class="submit" @click="submit">登录</button>
        </div>
    </div>
</template>

<script>
import {sendSmsCode,login} from '../untils/netWork';
    export default {
        data:()=>({
            phone:"18530549398",
            password:""
        }),
        methods:{
            submit(){
                var data={
                    mobile: this.phone,
                    sms_code:this.password,
                    type: 2,
                }
                login(data).then(res=>{
                    var data=res.data;
                    if(res.code==200){
                        window.localStorage.setItem("username",data.id);
                        window.localStorage.setItem("token",data.remember_token);
                        this.$router.push('/mine')
                    }
                })
            },
            toLogin(){
                this.$router.push("/login")
            },
            sendCode(){
                var data={
                    mobile: this.phone,
                    sms_type: "login",
                };
                sendSmsCode(data).then(res=>{
                    console.log(res)
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
@import "@/assets/common.scss";
.register{
    width: 100%;
    .logo{
        width: 65%;
        margin: 50px auto;
        img{
            width: 100%;
        }
    }
    .van-cell{
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .findPassword,
    .register-a{
        height: 30px;
        line-height: 30px;
        color: rgb(200,200,200);
    }
    .findPassword{
        float: left;
        padding-left: 15px;
    }
    .register-a{
        float: right;
    }
    .form{
        width: 80%;
        margin: 20px auto;
        .submit{
            width: 100%;
            height: 45px;
            margin-top: 50px;
            border: 0;
            outline: none;
            background: linear-gradient(to right, rgb(255,139,64) , rgb(252,85,0));
            border-radius: 30px;
            font-size: 18px;
            color: white;
        }
    }

}

</style>